import { createRouter, createWebHistory } from 'vue-router';
import Layout from '../components/Layout.vue'
import SubApp from '../views/SubApp.vue'

const routes = [
  // {
  //   path: '/',
  //   name: 'Home',
  //   component: () => import('../views/Home.vue'),
  // },
  {
    path: '/',
    name: 'MainApp',
    // component: () => import('../components/Layout.vue'), // 主应用入口
    component: Layout,
    children: [
      {
        path: '/sub-react/:patchMatch(.*)*', //匹配React子应用的所有页面
        name: 'ReactApp',
        component: SubApp, // 容器页面
      },
      {
        path: '/sub-vue/:patchMatch(.*)*', // 匹配Vue子应用的所有页面
        name: 'VueApp',
        component: SubApp, // 容器页面
      },
    ]
    // 由于子应用的页面都需要以Layout包裹

  }
];

export default createRouter({
  history: createWebHistory(),
  routes,
});


// const globalMenu = [
//   {
//     name: 'vue子应用',
//     path: '/sub-vue',
//     children: [
//       {
//         name: 'Vue子菜单1',
//         path: '/sub-vue/menu1'
//       },
//       {
//         name: 'Vue子菜单2',
//         path: '/sub-vue/menu2'
//       }
//     ]
//   },
//   {
//     name: 'react子应用',
//     path: '/sub-react',
//     children: [
//       {
//         name: 'React子菜单1',
//         path: '/sub-react/menu1'
//       },
//       {
//         name: 'React子菜单2',
//         path: '/sub-react/menu2'
//       }
//     ]
//   }
// ]

// export default globalMenu
